<template>
	<view class="cl " >
		<view class="cu-timeline" v-if="cl">
			<view class="cu-time">{{today}}</view>
			<view class="cu-item cuIcon-remind text-red ">
				<view class="content shadow-blur" v-bind:class="'bg-'+ColorList[Math.random() * ColorList.length | 0].name">
					<view class="cu-capsule radius">
						<view class="cu-tag line-white">{{lunch}}</view>
					</view>
					<view class="margin-top">
						<view v-for="(item,index) in cl.mid" v-bind:key="index" class="cu-tag radius line-white">
							{{item?item.name:"没菜啦！！！"}}
						</view>
					</view>
				</view>
	
			</view>
			<view class="cu-item  cuIcon-remind text-progress">
				<view class="content shadow-blur" v-bind:class="'bg-'+ColorList[Math.random() * ColorList.length | 0].name">
					<view class="cu-capsule radius">
						<view class="cu-tag line-white">{{dinner}}</view>
					</view>
					<view class="margin-top">
						<view v-for="(item,index) in cl.lat" v-bind:key="index" class="cu-tag radius line-white">
							{{item?item.name:"没菜啦！！！"}}
						</view>
					</view>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	export default{
		data() {
			return {
				today: "今天",
				lunch: "午餐",
				dinner: "晚餐",
			};
		},
		name: 'foot-current',
		props:{
			cl(){
				return{
					type: Object,
					default:null,
				}
			}
		}
	}
</script>

<style>
</style>
